<template>
     <div class="box1">
        <header class="header">
      <van-nav-bar
  title="注册"

  left-arrow
  @click-left="$router.back()"
/>
        </header>
        <main class="content"> 
         
           <van-form @submit="onSubmit">
  <van-cell-group inset>
    <van-field
      v-model="username"
      name="username"
      label="用户名"
      placeholder="用户名"
      :rules="[{ required: true, message: '请填写用户名' },{pattern:/^1[3-9]\d{9}$/,message:'请输入11位手机号'}]"
    />
    <van-field
      v-model="password"
      type="password"
      name="password"
      label="密码"
      placeholder="密码"
      :rules="[{ required: true, message: '请填写密码' }]"
    />
  </van-cell-group>
  <div style="margin: 16px;">
    <van-button round block type="primary" native-type="submit">
      注册
    </van-button>
  </div>

</van-form>

 
        </main>
       </div>

</template>

<script setup >
import request from "@/utils/request";
import { ref} from "vue";
import {useRouter} from 'vue-router'
import { showSuccessToast, showFailToast } from 'vant';
const router =useRouter()
const username=ref('')
const password=ref('')
const onSubmit=(values)=>{
   request.post('/register',values).then(res=>{
    if(res.data.code==200)
    {
      showSuccessToast(res.data.message);
      router.push('/login')
    }else{
      showFailToast(res.data.message);
    }
   })
}
</script>